<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <title></title>
    <link rel="stylesheet" href="css/mui.min.css" />
</head>
<body>
	<header class="mui-bar mui-bar-nav">
		<div class="mui-title">在线商城</div>
		<a class="mui-icon mui-icon-contact mui-pull-right" id="btnContact"></a>
	</header>
	<!-- 底部nav-->
    <nav class="mui-bar mui-bar-tab">
        <a v-href="pages/home.html" class="mui-tab-item mui-active" id="defaultTab">
            <span class="mui-icon mui-icon-home"></span>
            <span class="mui-tab-label">首页</span>
        </a>
        <a v-href="pages/enterpriselist.html" class="mui-tab-item" >
            <span class="mui-icon mui-icon-gear"></span>
            <span class="mui-tab-label">商户</span>
        </a>
        <a v-href="pages/myselflist.html" class="mui-tab-item" >
            <span class="mui-icon mui-icon-list"></span>
            <span class="mui-tab-label">我的</span>
        </a>
    </nav>
	<script src="js/mui.min.js"></script>
	<script type="text/javascript" charset="utf-8">
      	mui.init({});
      	//跳转页面
        var subpages = ["pages/home.html"];
        var subpage_style = {
            top: '40px',
            bottom: '51px'
        };
        var aniShow = {};//动画显示
      	var self = null;
      	//当前激活选项
        var activeTab = subpages[0];  
      	mui.plusReady(function(){
	        var temp = {};
	        temp[activeTab] = "true";
	        mui.extend(subpages,temp);//合并对象
	        console.log(JSON.stringify(subpages));
	        
	        self = plus.webview.currentWebview();
	        var sub = plus.webview.create(activeTab, activeTab, subpage_style);
	        self.append(sub);
        });
  		
  		//选项卡点击事件
    	mui('.mui-bar-tab').on('tap', 'a', function(e) {
        	var targetTab = this.getAttribute('v-href');
        	console.log(targetTab);
        	if (targetTab == "" || targetTab == activeTab) {
            	return;
        	}
            //显示目标选项卡
            //若为iOS平台或非首次显示，则直接显示
            if(mui.os.ios||subpages[targetTab]){
                plus.webview.show(targetTab);
                console.log("直接显示...");
            }else{
                //否则，使用fade-in动画，且保存变量
                subpages.push(targetTab);
                
                var temp = {};
                temp[targetTab] = "true";
                mui.extend(subpages,temp);//合并对象
                console.log(JSON.stringify(subpages));
                
                var sub = plus.webview.create(targetTab, targetTab, subpage_style);
                self.append(sub);
                //plus.webview.show(targetTab,"fade-in",300);
                console.log("创建显示...");
            }
        	//隐藏当前;
        	if(activeTab != null){
        		plus.webview.hide(activeTab);
        		console.log("隐藏当前..."+activeTab);
        	}
            //更改当前活跃的选项卡
            activeTab = targetTab;
        });
      	
    </script>
</body>
</html>